<template>
  <div class="container" @click.stop="showLanguageHandel">
    <!-- <div class="shadowLeftTop-1"></div>
    <div class="shadowLeftTop-2"></div>
    <div class="shadowRightBottom"></div> -->
    <div class="page_content container-tt">
      <header class="flex_between">
        <div class="headLogo">
          <div class="flex_ shou" @click="goToApp('video')">
            <img
              src="@/static/logo.svg"
              class="img"
              alt="logo"
              width="34"
              height="34"
            />
            <span class="projectName">SavingTik</span>
          </div>
        </div>
        <div class="headTabs flex_">
          <!-- <div class="tItem shou" @click="goToApp('video')">
            {{ currentObj.TikTokDownloader }}
          </div> -->
          <div class="tItem shou" @click="goToApp('mp3')">
            {{ currentObj.DownloadTikTokMP3 }}
          </div>
          <div class="tItem shou" @click="goToApp('story')">
            {{ currentObj.DownloadTikTokStory }}
          </div>
          <language ref="languageRef"></language>
        </div>
        <div class="drawer" @click="showAppRightHandel">
          <img src="@/static/menu.png" class="img" alt="" />
        </div>
      </header>
      <div class="textContent flex_ccenter">
        <div class="content">
          <h3>Terms of Service</h3>
          <div class="text">Welcome to SavingTik!</div>
          <div class="text">
            Please read this statement of privacy practices carefully before
            using our service:
          </div>
          <div class="text">
            SavingTik ("Our," "We," or "Us") is comprised of web pages
            containing information provided by us. Your access to the Site is
            offered to you conditioned on your acceptance of these Terms of
            Service and our statement of privacy practices, incorporated herein
            by this reference and found at ("Terms"). If the terms of this
            agreement are considered an offer, acceptance is expressly limited
            to such terms. If you do not unconditionally agree to all the terms
            and conditions of this agreement, you have no right to use the
            Site/Client and any other linked services.
          </div>
          <div class="text">
            The following terminology applies to these Terms and Conditions,
            Privacy Statement and Disclaimer Notice, and all Agreements:
            "Client, Content" and "You're" refer to you, the person logged on to
            this website and compliant with the Company's terms and conditions.
            "The Company", "Ourselves," "We," "Our," and "Us" refer to our
            Company. "Party," "Parties," or "Us" refers to both the Client and
            ourselves. All terms refer to the offer, acceptance, and
            consideration of payment necessary to undertake the process of our
            assistance to the Any use of the above terminology or other words in
            the singular, plural, capitalization, and" they or they, are taken
            as interchangeable and therefore as referring to same.
          </div>
          <h3>Access to the services</h3>
          <div class="text">
            Please note that we reserve the right, in its sole discretion, to
            change these Terms at any time upon notice. You can review the most
            current version of the Terms at any time. The updated Terms are
            binding on you on the version date indicated in the updated Terms.
            If you disagree with the revised terms, stop using the SavingTik
            service. Your continued service use after the effective date will
            constitute your acceptance of the updated Terms.
          </div>
          <h3>Changes to the site/client</h3>
          <div class="text">
            You may use the Site/Client if and when it is available. We do not
            guarantee the availability of the Site/Client or any particular
            feature. A specific part may be a pre-release version and may not
            work correctly or in the way a final version might work. We may
            significantly change the final version or decide not to release it.
            We reserve the right to change, remove, delete, restrict, or block
            access to, charge for, or stop providing all or any part of the
            Site/Client at any time without notice.
          </div>
          <h3>Content</h3>
          <div class="text">
            SavingTik Site/Client and any other linked services must only be
            used for private purposes. Any commercial use of SavingTik is
            strictly forbidden and will be pursued in a court of law. It is the
            only purpose of SavingTik to create a copy of downloadable online
            content for the private use of the user ("fair use"). Any further
            use of the content transmitted by SavingTik, particularly but not
            exclusively making the content publicly accessible or using it
            commercially, must be agreed upon with the holder of the rights of
            the respective downloaded content. The user bears full
            responsibility for all actions related to the data transmitted by
            SavingTik. SavingTik does not grant any rights to the contents, as
            it only acts as a technical service provider. The Site/Client or the
            apps in the Site/Client may contain links to third-party websites or
            clients("Linked Sites/Client"). The Linked Sites/Client are not
            under our control, and we are not responsible for any Linked Site,
            including any content contained in a Linked Site or any changes or
            updates to a Linked Site. We provide links to you only as a
            convenience, and including any link does not imply our endorsement
            of the site or any association with its operators. The user is
            responsible for checking the legitimacy of his use of SavingTik.
            SavingTik only provides technical services. Hence, SavingTik does
            not take liability towards the user or any third party for the
            permissibility of downloading content through SavingTik. You
            represent and warrant to us that: (A) you are an individual (i.e.,
            not a corporation) and you are of legal age to form a binding
            contract or have your parent’s permission to do so, and you are at
            least 13 years of age or older; (B) all registration information you
            submit is accurate and truthful; and (C) you will maintain the
            accuracy of such information. You also certify that you are legally
            permitted to use and access the services and take full
            responsibility for the selection and use of and access to the
            services. This agreement is void where prohibited by law, and the
            right to access the services is revoked in such jurisdictions.
          </div>
          <h3>Warranty Disclaimer</h3>
          <div class="text">
            To the maximum extent permitted by applicable law, the Site and
            Content are provided “AS IS,” “WITH ALL FAULTS,” and “AS AVAILABLE,”
            and the entire risk of use and performance remains with you.
            SavingTik, its suppliers, and licensors DO NOT MAKE ANY
            representations, warranties, or conditions, express, implied, or
            statutory, and disclaim any implied warranties of merchantability,
            merchantable quality, fitness for a particular purpose, title, quiet
            Enjoyment, or non-infringement. In particular, SavingTik, its
            suppliers, and licensors make no warranty that the Site or Content:
            (A) will meet your requirements; (B) will be available or provided
            on an uninterrupted, timely, secure, or error-free basis; (C) any
            information or content obtained through the SITE will be accurate,
            complete, or reliable; or (D) that any defects or errors therein
            will be corrected. All Content you download or obtain through the
            Site is accessed at your own risk, and you will be solely
            responsible for any damage or loss. You may have additional rights
            under local laws that THESE TERMS cannot change. In particular, to
            the extent local legislation implies statutory terms that cannot be
            excluded, THOSE terms are deemed incorporated into this document.
            However, SavingTik’s liability for a breach of THOSE statutory
            implied terms is limited by and to the extent permissible under THAT
            legislation.
          </div>
          <h3>You must not</h3>
          <div class="text">Republish material from SavingTik</div>
          <div class="text">
            Sell, rent, or sub-license material from SavingTik
          </div>
          <div class="text">
            Reproduce, duplicate, or copy material from SavingTik
          </div>
          <div class="text">Redistribute content from SavingTik</div>
          <div class="text">This Agreement shall begin on the date hereof.</div>
          <h3>You warrant and represent that.</h3>
          <div class="text">
            You are entitled to post the Comments on our website and have all
            necessary licenses and consents to do so;
          </div>
          <div class="text">
            The Comments do not invade any intellectual property right,
            including without limitation, copyright, patent, or trademark of any
            third party;
          </div>
          <div class="text">
            The Comments do not contain defamatory, libelous, offensive,
            indecent, or otherwise unlawful material, which is an invasion of
            privacy.
          </div>
          <div class="text">
            The Comments will not be used to solicit or promote business or
            custom or present commercial or unlawful activities.
          </div>
          <h3>Contact</h3>
          <div class="text">
            If you have any questions, complaints, or claims concerning the
            Services, you may contact us at please Email us <a
              class="link"
              :href="`mailto:${emailAddress}`"
              >happyfish2024@gmail.com</a
            >.
          </div>
        </div>
      </div>
      <div class="footer">
        <div class="bottom_nav flex_between">
          <div class="logo">
            <img src="@/static/biglogo.png" class="img" alt="" />
          </div>
          <div class="nav_list flex_">
            <div class="item">
              <div class="item_title">{{ currentObj.Company }}</div>
              <nuxt-link to="/contact">
                <div class="item_text shou">{{ currentObj.contact }}</div>
              </nuxt-link>
              <nuxt-link to="/blog">
                <div class="item_text shou">blog</div>
              </nuxt-link>
            </div>
            <div class="item">
              <div class="item_title">{{ currentObj.Legal }}</div>
              <nuxt-link to="/terms-of-use">
                <div class="item_text">{{ currentObj.Termsofuse }}</div>
              </nuxt-link>
              <nuxt-link to="/privacy-policy">
                <div class="item_text">{{ currentObj.PrivacyPolicy }}</div>
              </nuxt-link>
            </div>
            <div class="item">
              <div class="item_title">{{ currentObj.Tools }}</div>
              <!-- <div class="item_text shou" @click="goToAppTools('video')">
                {{ currentObj.TikTokDownloader }}
              </div>
              <div class="item_text shou" @click="goToAppTools('mp3')">
                {{ currentObj.DownloadTikTokMP3 }}
              </div>
              <div class="item_text shou" @click="goToAppTools('story')">
                {{ currentObj.DownloadTikTokStory }}
              </div> -->
              <nuxt-link to="/save-tiktok-videos-without-posting">
                <div class="item_text shou">
                  How to save tiktok videos without posting
                </div>
              </nuxt-link>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="page_bottom flex_center">
      ©SavingTik.Com 2023 All Rights Reserved.
    </div>
    <article-content></article-content>
    <div class="app_page_bottom">
      <div class="hefl flex_center">
        ©SavingTik.Com 2023 All Rights Reserved.
      </div>
      <div class="link flex_ccenter">
        <nuxt-link to="/contact">
          <div>{{ currentObj.contact }}</div>
        </nuxt-link>
        <nuxt-link to="/terms-of-use">
          <div class="tr">{{ currentObj.Termsofuse }}</div>
        </nuxt-link>
        <nuxt-link to="/privacy-policy">
          <div>{{ currentObj.PrivacyPolicy }}</div>
        </nuxt-link>
        <nuxt-link to="/blog">
          <div>blog</div>
        </nuxt-link>
      </div>
    </div>
    <video src="" id="video" autoplay muted v-show="false"></video>
    <div class="dloading" v-if="dloading">
      <div class="loader"></div>
    </div>
    <van-popupapp ref="popupAppRef"></van-popupapp>
  </div>
</template>
<script>
import CryptoJS from "crypto-js";
import { ImagePreview } from "vant";
import { handleClick } from "@/plugins/Firebase.js";
import { mapState, mapGetters, mapMutations } from "vuex";
import vanPopupapp from "@/components/vanPopupapp.vue";
import dataList from "@/static/tools.js";
import language from "@/components/language.vue";
import ArticleContent from "~/components/articleContent.vue";

export default {
  components: { vanPopupapp, language, ArticleContent },
  head: {
    title: "Terms of use - SavingTik",
    meta: [
      {
        name: "viewport",
        content:
          "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no",
      },
      { name: "robots", content: "index, follow" },
      { name: "revisit-after", content: "1 days" },
      {
        name: "description",
        content: "Terms of use - SavingTik",
      },
      {
        itemprop: "name",
        content: "Terms of use - SavingTik",
      },
      { name: "author", content: "SavingTik" },
      { property: "og:locale", content: "en" },
      { name: "msvalidate.01", content: "" },
      { itemprop: "image", content: "/static/logo/savingtik-thumb.webp" },
      { name: "twitter:card", content: "summary" },
      { name: "twitter:title", content: "Terms of use - SavingTik" },
      { name: "twitter:description", content: "Terms of use - SavingTik" },
      {
        name: "twitter:image:src",
        content: "/static/logo/savingtik-thumb.webp",
      },
      { name: "twitter:site", content: "SavingTik" },
      { property: "og:title", content: "Terms of use - SavingTik" },
      { property: "og:type", content: "article" },
      { property: "og:image", content: "/static/logo/savingtik-thumb.webp" },
      { property: "og:description", content: "Terms of use - SavingTik" },
      { property: "og:site_name", content: "SavingTik" },
      { name: "google", content: "notranslate" },
    ],
    link: [
      // Favicons
      {
        rel: "shortcut icon",
        href: "/static/logo/favicon.png",
        sizes: "512x512",
      },
      {
        rel: "apple-touch-icon",
        href: "/static/logo/favicon.png",
        sizes: "192x192",
      },
      //Apple Touch Icons

      //multilingual
      {
        rel: "canonical",
        href: "https://savingtik.com/terms-of-use",
      },
    ],
  },
  name: "contact",
  data() {
    return {
      showSwiper: false,
      showBigImage: false,
      showAppRight: false,
      input: "",
      dloading: false,

      showLanguage: false,
      Language: "en_GB",
      isHttpLoading: false,
      downSuccess: false,
      downStorySuccess: false,
      httpError: false,
      downData: {},
      WithoutVideoSize: "",
      duration: "",
      VideoSize: "",
      emailAddress: "happyfish2024@gmail.com",
      currentList: dataList.list,
      list: [
        "English", // 英语
        "Bahasa Indonesia", // 印度尼西亚语
        "Tiếng Việt", // 越南语
        "Bahasa Malaysia", // 马来语
        "Basa Jawa", // 爪哇语
        "Čeština", // 捷克语
        "Español", // 西班牙语
        "Français", // 法语
        "German", // 德语
        "Italian", // 意大利语
        "Magyar", // 匈牙利语
        "Nederlands", // 荷兰语
        "Polish", // 波兰语
        "Português", // 葡萄牙语
        "Română", // 罗马尼亚语
        "Thailand", // 泰语
        "Turkish (Turkey)", // 土耳其语
        "Ελληνικά", // 希腊语
        "украї́нська мо́ва", // 乌克兰语
        "Русский", // 俄语
        "عَرَبِيّ", // 阿拉伯语
        "한국어", // 韩语
        "日本語", // 日语
      ],
      list1: [
        "en", // 英语
        "id", // 印度尼西亚语
        "vn", // 越南语
        "ms", // 马来语
        "jv", // 爪哇语
        "cs", // 捷克语
        "es", // 西班牙语
        "fr", // 法语
        "de", // 德语
        "it", // 意大利语
        "hu", // 匈牙利语
        "nl", // 荷兰语
        "pl", // 波兰语
        "pt", // 葡萄牙语
        "ro", // 罗马尼亚语
        "th", // 泰语
        "tr", // 土耳其语
        "el", // 希腊语
        "uk", // 乌克兰语
        "ru", // 俄语
        "ar", // 阿拉伯语
        "ko", // 韩语
        "ja", // 日语
      ],
    };
  },
  computed: {
    ...mapGetters(["language"]),
    currentObj() {
      return this.currentList[this.current];
    },
    current() {
      return this.list1.findIndex((x) => x == this.language);
    },
  },
  mounted() {
    if (process.client) {
      if (!localStorage.getItem("language")) {
        localStorage.setItem("language", "en");
        this.setLanguageHandel("en");
      } else {
        this.setLanguageHandel(localStorage.getItem("language"));
      }
    }
  },
  methods: {
    showAppRightHandel() {
      this.$refs.popupAppRef.open();
    },
    showLanguageHandel() {
      this.$refs.languageRef.close();
    },
    ...mapMutations(["setLanguage"]),
    setLanguageHandel(lang) {
      this.setLanguage(lang);
    },
    goToApp(type) {
      let url = "";
      switch (type) {
        case "video":
          url = "";
          break;
        case "mp3":
          url = "/download-tiktok-mp3";
          break;
        default:
          url = "/download-tiktok-story";
      }
      if (this.language !== "en") {
        url = `/${this.language}${url}`;
      } else if (this.language == "en" && type == "video") {
        url = `/`;
      }
      this.$router.push(url);
      // 切换页面 action_page_switch
      handleClick("action_page_switch", {
        site: type,
        from: "top",
      });
    },
    goToAppTools(type) {
      let url = "";
      switch (type) {
        case "video":
          url = "";
          break;
        case "mp3":
          url = "/download-tiktok-mp3";
          break;
        default:
          url = "/download-tiktok-story";
      }
      if (this.language !== "en") {
        url = `/${this.language}${url}`;
      }
      this.$router.push(url);
      // 切换页面 action_page_switch
      handleClick("action_page_switch", {
        site: type,
        from: "tools",
      });
    },
  },
};
</script>
      <style lang="scss" scoped>
@media (min-width: 1024px) {
  .link {
    color: #3ec6ff;
  }
  // .shadowLeftTop-1 {
  //   position: fixed;
  //   width: 1095px;
  //   height: 678px;
  //   background: #ff0ead;
  //   mix-blend-mode: normal;
  //   left: -200px;
  //   top: -135px;
  //   -webkit-filter: blur(487px);
  //   opacity: 0.35;
  //   filter: blur(478px);
  //   transform: rotate(16deg);
  // }
  // .shadowLeftTop-2 {
  //   position: fixed;
  //   width: 857px;
  //   height: 541px;
  //   background: #092877;
  //   mix-blend-mode: normal;
  //   left: -346px;
  //   top: -346px;
  //   -webkit-filter: blur(240px);
  //   opacity: 0.25;
  //   filter: blur(240px);
  //   transform: rotate(45deg);
  // }
  // .shadowRightBottom {
  //   position: fixed;
  //   width: 1021px;
  //   height: 533px;
  //   background: #00fff7;
  //   mix-blend-mode: normal;
  //   right: -803px;
  //   bottom: 15px;
  //   -webkit-filter: blur(378px);
  //   opacity: 0.25;
  //   filter: blur(378px);
  //   transform: rotate(20deg);
  // }
  .page_content {
    min-height: calc(100vh - 153px);
    z-index: 100;
    // position: relative;
    z-index: 999;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    header {
      // position: relative;
      padding: 14px 0;
      z-index: 999;
      .headLogo {
        width: 34px;
        height: 34px;
        .projectName {
          font-size: 21px;
          font-family: Inter-Extra Bold Italic, Inter;
          font-weight: 800;
          font-style: italic;
          color: #ffffff;
          margin-left: 14px;
        }
      }
      .drawer {
        display: none;
      }
      .headTabs {
        .tItem {
          position: relative;
          width: 220px;
          text-align: right;
          height: 38px;
          font-size: 14px;
          font-family: Poppins-Light, Poppins;
          color: rgba(255, 255, 255, 0.5);
          line-height: 38px;
          .bor {
            position: absolute;
            bottom: -18px;
            left: 70px;
            width: 152px;
            height: 1px;
            background: rgba(255, 255, 255, 0.5);
          }
          .expand {
            position: absolute;
            top: 0;
            right: -20px;
            width: 10px;
            height: 8px;
            margin-left: 4px;
          }
          .Language_box {
            position: absolute;
            left: 100px;
            bottom: -200px;
            z-index: 9999;
            width: 162px;
            height: 177px;
            background: rgba(43, 67, 89, 0.15);
            border-radius: 12px;
            overflow-y: scroll;
            padding: 0 14px;
            .item {
              padding: 14px 0;
              border-bottom: 1px solid rgba(125, 125, 125, 0.1);
              font-size: 14px;
              font-family: Poppins-Regular, Poppins;
              font-weight: 400;
              color: rgba(255, 255, 255, 0.5);
              text-align: center;
              line-height: 1;
              .dian {
                width: 4px;
                height: 4px;
                border-radius: 50%;
                background-color: rgba(0, 255, 247, 1);
                margin-right: 10px;
              }
            }
            .changeItemColor {
              font-size: 14px;
              font-family: Poppins-Regular, Poppins;
              font-weight: 400;
              color: #ffffff;
            }
            .item:last-child {
              border: 0;
            }
          }
        }
        .tItemFFF {
          color: #fff;
        }
        .tItemBlod {
          color: #fff;
          font-weight: 700;
          // font-family: Poppins-Bold, Poppins;
        }
      }
    }
    .textContent {
      flex: 1;
      color: #fff;
      padding-bottom: 150px;
      .content {
        flex: 1;
        padding-top: 100px;
        width: 800px;
        font-size: 22px;
        line-height: 32px;
        .text {
          color: rgba(255, 255, 255, 0.5);
          font-size: 16px;
        }
        h3 {
          margin: 30px 0;
        }
      }
    }
    .footer {
      // position: relative;

      .bottom_nav {
        align-items: flex-start;
        .logo {
          transform: translate(-10px, -27px);
          width: 132px;
          height: 171px;
        }
        .nav_list {
          align-items: flex-start;
          .item {
            margin-left: 140px;
            width: 200px;
            .item_title {
              margin-bottom: 20px;
              font-size: 18px;
              font-family: Poppins-Bold, Poppins;
              font-weight: bold;
              color: #ffffff;
            }
            .item_text {
              margin-bottom: 20px;
              font-size: 14px;
              font-family: Poppins-Regular, Poppins;
              font-weight: 400;
              color: rgba(255, 255, 255, 0.5);
            }
          }
        }
      }
    }
  }
  .page_bottom {
    margin-top: 30px;
    padding: 40px 0;
    border-top: 2px solid rgba(217, 217, 217, 0.1);
    font-size: 14px;
    font-family: Poppins-Regular, Poppins;
    color: rgba(255, 255, 255, 0.5);
  }
  .app_page_bottom {
    display: none;
  }
}
@media (max-width: 1023px) {
  /* 当设备屏幕宽度小于等于1023像素时，应用其中定义的样式。 */

  // .shadowLeftTop-1 {
  //   position: fixed;
  //   width: 300px;
  //   height: 300px;
  //   background: #ff0ead;
  //   mix-blend-mode: normal;
  //   left: -100px;
  //   top: -150px;
  //   -webkit-filter: blur(110px);
  //   opacity: 0.3;
  //   filter: blur(110px);
  //   transform: rotate(16deg);
  // }
  // .shadowLeftTop-2 {
  //   position: fixed;
  //   width: 200px;
  //   height: 200px;
  //   background: #092877;
  //   mix-blend-mode: normal;
  //   left: 50px;
  //   top: -50px;
  //   -webkit-filter: blur(80px);
  //   opacity: 0.25;
  //   filter: blur(80px);
  //   transform: rotate(45deg);
  // }
  // .shadowRightBottom {
  //   position: fixed;
  //   width: 300px;
  //   height: 200px;
  //   background: #26aaa6;
  //   opacity: 0.6;
  //   mix-blend-mode: normal;
  //   right: -125px;
  //   bottom: -12px;
  //   -webkit-filter: blur(100px);
  //   opacity: 0.25;
  //   filter: blur(100px);
  //   transform: rotate(20deg);
  // }
  .page_content {
    padding: 0 34px;
    min-height: 100vh;
    z-index: 100;
    width: 100%;
    header {
      // position: relative;
      padding: 14px 0;
      z-index: 999;
      .headLogo {
        transform: translateX(-14px);
        width: 19px;
        height: 19px;
        .projectName {
          font-size: 12px;
          font-family: Inter-Extra Bold Italic, Inter;
          font-weight: 800;
          font-style: italic;
          color: #ffffff;
          margin-left: 12px;
        }
      }
      .drawer {
        display: block;
        width: 26px;
        height: 26px;
        transform: translateX(14px);
      }
      .headTabs {
        display: none;
        .tItem {
          position: relative;
          width: 220px;
          text-align: right;
          height: 38px;
          font-size: 14px;
          font-family: Poppins-Light, Poppins;
          color: rgba(255, 255, 255, 0.5);
          line-height: 38px;
          .bor {
            position: absolute;
            bottom: -18px;
            left: 82px;
            width: 142px;
            height: 1px;
            background: rgba(255, 255, 255, 0.5);
          }
          .expand {
            position: absolute;
            top: 0;
            right: -20px;
            width: 10px;
            height: 8px;
            margin-left: 4px;
          }
          .Language_box {
            position: absolute;
            left: 100px;
            bottom: -200px;
            z-index: 9999;
            width: 162px;
            height: 177px;
            background: rgba(43, 67, 89, 0.15);
            border-radius: 12px;
            overflow-y: scroll;
            padding: 0 14px;
            .item {
              padding: 14px 0;
              border-bottom: 1px solid rgba(125, 125, 125, 0.1);
              font-size: 14px;
              font-family: Poppins-Regular, Poppins;
              font-weight: 400;
              color: rgba(255, 255, 255, 0.5);
              text-align: center;
              line-height: 1;
              .dian {
                width: 4px;
                height: 4px;
                border-radius: 50%;
                background-color: rgba(0, 255, 247, 1);
                margin-right: 10px;
              }
            }
            .changeItemColor {
              font-size: 14px;
              font-family: Poppins-Regular, Poppins;
              font-weight: 400;
              color: #ffffff;
            }
            .item:last-child {
              border: 0;
            }
          }
        }
        .tItemFFF {
          color: #fff;
        }
        .tItemBlod {
          color: #fff;
          font-weight: 700;
          // font-family: Poppins-Bold, Poppins;
        }
      }
    }
    .textContent {
      // position: relative;
      flex: 1;
      color: #fff;
      padding-bottom: 50px;
      .content {
        flex: 1;
        padding-top: 20px;
        font-size: 18px;
        line-height: 32px;
        .text {
          color: rgba(255, 255, 255, 0.5);
          font-size: 13px;
        }
        h3 {
          margin: 20px 0;
        }
      }
    }
    .footer {
      display: none;
      margin-top: 300px;
      .bottom_nav {
        align-items: flex-start;
        .logo {
          transform: translate(-60px, -77px);
          width: 182px;
          height: 182px;
        }
        .nav_list {
          align-items: flex-start;
          .item {
            margin-left: 140px;
            .item_title {
              margin-bottom: 20px;
              font-size: 21px;
              font-family: Poppins-Bold, Poppins;
              font-weight: bold;
              color: #ffffff;
            }
            .item_text {
              margin-bottom: 20px;
              font-size: 16px;
              font-family: Poppins-Regular, Poppins;
              font-weight: 400;
              color: rgba(255, 255, 255, 0.5);
            }
          }
        }
      }
    }
  }
  .page_bottom {
    display: none;
    margin-top: 100px;
    padding: 40px 0;
    border-top: 2px solid rgba(217, 217, 217, 0.1);
    font-size: 14px;
    font-family: Poppins-Regular, Poppins;
    color: rgba(255, 255, 255, 0.2);
  }
  .app_page_bottom {
    // position: relative;
    margin-top: 100px;
    padding: 14px 40px;
    padding-bottom: 20px;
    border-top: 1px solid rgba(217, 217, 217, 0.03);
    font-family: Poppins-Regular, Poppins;
    color: rgba(255, 255, 255, 0.5);
    .hefl {
      color: rgba(255, 255, 255, 0.1);

      font-size: 10px;
      margin-bottom: 12px;
    }
    .link {
      font-size: 12px;
      div {
        height: 50px;
        line-height: 50px;
      }
    }
  }
}
.popup_box {
  width: 100%;
  height: 100%;
  background: #080f25;

  .close {
    padding: 14px;
    .img {
      width: 26px;
      height: 26px;
    }
  }
  .page_box {
    margin-bottom: 20px;
    .item {
      padding: 16px;
      padding-left: 20px;
      font-size: 12px;
      font-family: Poppins-Regular, Poppins;
      font-weight: 400;
      color: rgba(255, 255, 255, 0.8);
      .dian {
        width: 4px;
        height: 4px;
        border-radius: 50%;
        background: #00fff7;
        margin-right: 8px;
      }
    }
    .item:nth-child(2) {
      background-color: rgba(17, 44, 60, 0.3);
      font-size: 12px;
      font-family: Poppins-Bold, Poppins;
      font-weight: bold;
      color: #00fff7;
    }
    .item:nth-child(1) {
      .dian {
        background: transparent;
      }
    }
    .item:nth-child(3) {
      .dian {
        background: transparent;
      }
    }
  }
  .Language_box {
    padding-top: 30px;
    border-top: 1px solid rgba(217, 217, 217, 0.1);
    .title {
      font-size: 12px;
      font-family: Poppins-Regular, Poppins;
      font-weight: 400;
      color: #ffffff;
      padding-bottom: 10px;
      padding-left: 20px;
    }
    .item {
      padding: 16px;
      padding-left: 20px;
      font-size: 12px;
      font-family: Poppins-Regular, Poppins;
      font-weight: 400;
      color: rgba(255, 255, 255, 0.8);
      .dian {
        width: 4px;
        height: 4px;
        border-radius: 50%;
        background: #00fff7;
        margin-right: 8px;
      }
    }
    .item:nth-child(2) {
      background-color: rgba(17, 44, 60, 0.3);
      font-size: 12px;
      font-family: Poppins-Bold, Poppins;
      font-weight: bold;
      color: #00fff7;
    }
    .item:nth-child(3) {
      .dian {
        background: transparent;
      }
    }
    .item:nth-child(4) {
      .dian {
        background: transparent;
      }
    }
    .item:nth-child(5) {
      .dian {
        background: transparent;
      }
    }
  }
}
@media (min-width: 992px) {
    .container-tt {
        max-width: 960px;
        margin-left: auto;
        margin-right: auto;
    }

    .page_content .footer .bottom_nav .nav_list {
        align-items: flex-start;

        .item {
            margin-left: 100px;
            width: 160px;

            .item_title {
                margin-bottom: 20px;
                font-size: 18px;
                font-family: Poppins-Bold, Poppins;
                font-weight: bold;
            }

            .item_text {
                margin-bottom: 20px;
                font-size: 14px;
                font-family: Poppins-Regular, Poppins;
                font-weight: 400;
            }
        }
    }
}

@media (min-width: 1200px) {
    .container-tt {
        max-width: 1140px;
        margin-left: auto;
        margin-right: auto;
    }

    .nav_list {
        align-items: flex-start;

        .item {
            margin-left: 140px !important;
            width: 200px !important;

            .item_title {
                margin-bottom: 20px;
                font-size: 18px;
                font-family: Poppins-Bold, Poppins;
                font-weight: bold;
            }

            .item_text {
                margin-bottom: 20px;
                font-size: 14px;
                font-family: Poppins-Regular, Poppins;
                font-weight: 400;
            }
        }
    }
}
</style>